@include('Home.head')
<style>
    .record-list{
        border-radius: 10px;
        padding: 0;
        background-color: #fff;
    }
    .record-list .am-nav-tabs {
        border-bottom: 1px solid #f6f6f6;
        display: flex;
        justify-content: space-around;
    }
    .record-list .am-nav-tabs>li {
        flex: 1;
        text-align: center;
        margin-bottom: 0;
    }

    .record-list .am-nav-tabs>li>a {
        font-size: 17px;
        color: #3b3b3b;
        border: none;
        margin: 0;
        position: relative;
        padding: 10px 0 3px;
        border-radius: 10px;
    }
    .record-list .am-nav-tabs>li.am-active>a::after{
        position: absolute;
        content: '';
        width: 100%;
        height: 2px;
        top: 100%;
        left: 0;
        background-color: #33c194;
    }
    .record-list.electronic-currency-list .am-nav-tabs>li.am-active>a::after{
        background-color: #22b8f0;
    }
    .record-list.bonus-currency-list .am-nav-tabs>li.am-active>a::after{
        background-color: #fb4818;
    }
    .record-list .am-tab-panel{
        padding: 0;
    }
    .record-list .am-tab-panel li a{
        font-size: 12px;
        color: #6c6b6b;
        display: flex;

    }
    .record-list .am-tab-panel li{
        border-bottom: 1px solid #f6f6f6;
        padding: 15px 30px;

    }
    .record-list .am-tab-panel li .list-left{
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    .record-list .am-tab-panel li .list-right{
        flex: 1.5;
        display: flex;
        flex-direction: column;

    }
    .record-list .am-tab-panel li .list-right i{
        float: right;
    }
    .banlance-list .state{
        color: #33c194
    }
    .electronic-currency-list .state{
        color: #22b8f0
    }
    .bonus-currency-list .state{
        color: #fb4818
    }
</style>
<body>
<div class="container" id="app">
    @include('Home.member.header')
    <div class="my-nav-bar">
        <ol class="am-breadcrumb">
            <li><a href="#">首页</a></li>
            <li><a href="#">股东分红列表</a></li>
        </ol>
    </div>
    <div class="am-cf cart-panel con-wra record-list">
        <ul class="am-tab-panel am-fade am-in am-active">
            <li  v-for="val in db" v-if="db.length">
                <a href="javascript:;" @click="getDetails(val.id)">
                    <div class="list-left">
                        <p>金额：@{{ val.money }}</p>
                    </div>
                    <div class="list-right">
                        <p>时间：@{{ val.created_at }} <i class="am-icon-angle-right"></i></p>
                    </div>
                </a>
            </li>
            <li v-if="db.length==0" style="text-align: center;font-size: 12px;">暂无收益</li>
        </ul>
    </div>
    @include('Home.foot')
</div>
</body>
<script>
    var app = new Vue({
        el: "#app",
        data: {
            title: '我的资料',
            db:''
        },
        methods: {
            //初始化 系统管理员列表
            initialize: function () {
                var type = this.obtain("type")
                $.post("/home/member/editInfo", {'_token': '{{csrf_token()}}', 'class': 'find'}, function (res) {
                    if (res.code) {
                        $.post("/home/shareholder/getShareholder", {
                            '_token': '{{csrf_token()}}',
                            uid: res.data.uid,
                            'class':'select',
                            type:type
                        }, function (res) {
                            if (res.code) {
                                app.db= res.data
                            } else {
                                // layer.msg(res.data);
                            }
                        });
                    } else {
                        layer.msg(res.data);
                    }
                });
            },
            getDetails: function (id) {
                // window.location.href = "/shop/member/user/transactionDetails?type="+type+"&id="+id;
                window.location.href = "/home/shareholder/shareholderDetail?id="+id;
            },
            obtain:function (val) {
                var query = window.location.search.substring(1);
                var vars = query.split("&");
                for (var i=0;i<vars.length;i++) {
                    var pair = vars[i].split("=");
                    if(pair[0] == val){
                        return pair[1];
                    }
                }
            }
        },
        //自动执行
        mounted: function () {
            this.initialize();
        },
    })
</script>
</html>
